import React from 'react'
// ===================================================================== Temp
import SearchForm from '#cpt/temp/SearchForm'
import Table from '#cpt/temp/Table'
import Confirm from '#cpt/temp/Confirm'
// ===================================================================== global declare
const { $fn, $Lazy } = window
// =====================================================================Lazy
// ===================================================================== private component
const $cache 		= $Lazy.file(()=>import('#private/cache-api'))
const $time 		= $Lazy.file(()=>import('@com/utils/time'))
const ConfirmTable	= $Lazy.state(()=>import('./confirm-table'))
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:[],
		pag: {},
		// 搜索表单列表
		forms : [
			{ label: '单位名称',		name: 'outsourcing_company_name',	type: 'select',		loading:true, nameStr:'label',	 outer: true,
				onValue: ({value}) => {
					this.searchFormRef.setValue({outsourcing_company_code: value })
					this.model.outsourcing_company_code = value
				},
			},
			{ label: '时间',		name: 'jz-time',		type:'date-range',	names: ['start_at','end_at'] },
			{ label: '单位编码',		name: 'outsourcing_company_code',
				onValue: ({value, forms}) => {
					const code = forms[0].data?.filter(v => v.value === value)
					this.searchFormRef.setValue({outsourcing_company_name: code.length === 0 ? '' : code[0].value })
					this.model.outsourcing_company_name = code.length === 0 ? '' : code[0].value
				}
			},
		],
		doneList: [],
		codeList: []
	}
	
	model = {}
	newKey = 0  // 强制更新用的key
	
	componentDidMount(){
		this.props.onRef?.(this)
		this.getSelect()
		$time.then(f=>{
			// 设置时间默认值
			const arr = f.duration['1-9-now']()
			this.resetModel = { start_at: arr[0], end_at: arr[1], 'jz-time':arr }
			this.model = $fn.copy(this.resetModel)
			if(window.isInit){
				this.fetch()
			}
		})
	}

	// paging
	fetch = () => $fn.fetch.call(this,'lis-outsourcing-company/lists', { isIndex: true, 
		callback: ({done, codes}) => {
			done.forEach((v,i) => v.index = i)
			this.setState({doneList: done, codeList: codes})
		}
	})
	
	// 获取下拉数据
	getSelect = () => {
		const { forms } = this.state
		$cache.then( async f => {
			// 外包单位
			const companyData = await f.getCache( { api:'getOutsourcingDepartList'} )
			$fn.setRow( forms, 'outsourcing_company_name', companyData?.outsourcing_company)
			
			this.setState({ forms })
		})
	}
	
	// 表单
	cols = [
		{ title: '外送单位', 	dataIndex: 'outsourcing_company', 		width:150 },
		{ title: '外送时间', 	dataIndex: 'outsourcing_created_at',	...$fn.table.time },
		{ title: '外送状态', 	dataIndex: 'outsourcing_status', 		...$fn.table.status },
		{ title: '条码号', 		dataIndex: 'old_spec_code', 			...$fn.table.spec_code },
		{ title: '姓名', 		dataIndex: 'patient_name', 				...$fn.table.name },
		{ title: '性别', 		dataIndex: 'sex_name', 					...$fn.table.sex  },
		{ title: '年龄', 		dataIndex: 'age', 						...$fn.table.age },
		{ title: '单一项目', 	dataIndex: 'kind_name', 				width:150 },
		{ title: '自然项目', 	dataIndex: 'parent_kind_name', 			width:150 },
		{ title: '科室', 		dataIndex: 'project_parent_name', 		width:100 },
		{ title: '岗位', 		dataIndex: 'project_name', 				width:100 },
	]

	// 操作按钮
	controls = () => {
		return []
	}
	
	// 删除
	onDel = uuid => Confirm.call(this, '删除', 'lis-outsourcing-company/del', { param: [ uuid ], isKeys: !uuid, idStr:'uuids' })
	
	render(){
		const { doneList, codeList } = this.state
		this.newKey++
		return (
			<>
				<div className='fx ex mt5'>
					<div className="fv" style={{width: '54%'}}>
						{/* 搜索 */}
						{ SearchForm.call(this, { timeStr: '1-9-now' }) }
						{/* 表格 */}
						{ Table.call(this,{ wrapClassName: '', isInit:window.isInit, isIndex: true}) }
					</div>
					<div className='ex fv'>
						<ConfirmTable key={this.newKey} data={doneList} codes={codeList} refresh={this.fetch} />
					</div>
				</div>
			</>
		)
	}
}

// 2021-11-3 2:35:00 ?F10: PM? --伍智睿
export default Index